<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8" name="viewport" content="
	width=viewport,
	initial-scale=1.0,
	user-scalable=no
	"/>
	<title>大作业</title>
	<link rel="stylesheet" type="text/css" href="css/reset.css"/>
	<link rel="stylesheet" type="text/css" href="css/main.css"/>

</head>
<body>
	<div class="g-doc">
		<!-- 头部 -->
		<div class="g-hd">
			<!-- 提醒栏 -->
			<div class="m-topnav" id="j-topnav">
				<div class="wrap-1">
					<p>网易云课堂微专业，帮助你掌握专业技能，令你求职或加薪多一份独特优势！<a href="#">立即查看></a></p>
					<p class="hint">不再提醒</p>
				</div>
			</div>
			<!-- 导航栏 -->
			<div class="m-botnav">
				<p class="m-logo"><i></i>网易教育产品部</p>
				<!-- 关注 -->
				<div class="m-login" id="j-login">
					<input class="follow-but" value="关注" type="button"/>

					<div class="follow-suc" style="display:none;">
						<input value="已关注">
						<a class="cancel" >取消</a>
					</div>

					<span class="fans">粉丝45</span>

					<!-- 弹出登录框 -->
					<div class="popup-login" style="display:none;">
						<div class="mask"></div>
						<div class="popup">
							<div class="colse"></div>
							<p>登录网易云课堂</p>
							<div class="error" style="display:none;"></div>
							<div class="username">
								<input tabindex="1" type="text" name="userName"><label>手机号/邮箱</label>	
							</div>
							<div class="password">
								<input tabindex="2" type="password" name="password"><label>密码</label>
							</div>
							<div class="optional">
								<label><input class="remember" type="checkbox" checked >十天内免登录</label>
								<a href="#">免费注册</a>
								<a href="#">忘记密码</a>
							</div>
							<button tabindex="3" class="login-but">登 录</button>
						</div>
					</div>

				</div>
				<!-- 导航 -->
				<div class="m-nav">
					<a href="http://open.163.com/" target="blank">网易公开课</a>
					<a href="http://study.163.com/" target="blank">云课堂</a>
					<a href="http://www.icourse163.org/" target="blank">中国大学MOOC</a>
					<a class="search" href="#" ></a>
				</div>
			</div>
		</div>

		<div class="g-bd">
			<div class="g-top">
				<!-- 轮播 -->
				<div class="m-slider" id="j-slider">
					<a href="#" target="blank"><img src="img/banner2.jpg" style="transition: 0.5s; opacity:1;"></a>
					<!-- <a href="#" class="transition"><img src="img/banner2.jpg"></a>
					<a href="#" class="transition"><img src="img/banner3.jpg"></a> -->
					<ul class="pointer">
					</ul>
				</div>
				<!-- 三个产品 -->
				<div class="m-product">
					<div class="pro">
						<i class="icon-1"></i>
						<div class="text">
						<h1>网易公开课</h1>
						<p>推出国内外名校公开课，涉及广泛的学科，名校老师认真讲解深度剖析，网易视频公开课频道搭建起强有力的网络视频教学平台。</p>
						<a href="#">了解更多></a>
						</div>
					</div>
					<div class="pro">
						<i class="icon-2"></i>
						<div class="text">
						<h1>云课堂</h1>
						<p>网易旗下大型在线学习平台，该平台面向学习者提供海量免费、优质课程，创新的个性化学习体验，自由开放的交流互动环境。</p>
						<a href="#">了解更多></a>
						</div>
					</div>
					<div class="pro">
						<i class="icon-3"></i>
						<div class="text">
						<h1>中国大学MOOC</h1>
						<p>是爱课程网携手云课堂打造的在线学习平台，每一个有提升愿望的人，都可以在这里学习中国最好的大学课程，学完还能获得认证证书。</p>
						<a href="#">了解更多></a>
						</div>
					</div>
				</div>
				<!-- 工作环境 -->
				<div class="m-workplace">
					<div>
						<img src="img/workplace1.jpg"/>
						<img src="img/workplace2.jpg"/>
						<img src="img/workplace3.jpg"/>
						<img src="img/workplace4.jpg"/>
						<img src="img/workplace5.jpg"/>
					</div>
				</div>
			</div>

			<div class="g-bot">
				<div class="warp-2">
					<div class="g-main" id="j-main">
						<!-- 课程切换按钮 -->
						<div class="tab">
							<input class="cur" type="button" value="产品设计" />
							<input type="button" value="编程语言" />
						</div>
						<!-- 课程内容 -->
						<div class="m-course">
							<div class="course design">
								<!-- <div class="m-team">
									<img src="http://img2.ph.126.net/1Md8406dmo1TPHnYD67fdw==/6598260537750239978.jpg"/>
									<p class="name j-name">Windows Phone 7 带来了什么?</p>
									<p class="provider j-provider">极客公园</p>
									<span class="j-count">469</span>
									<strong>免费</strong>
									<a href="#">
										<img src="http://img2.ph.126.net/1Md8406dmo1TPHnYD67fdw==/6598260537750239978.jpg"/>
										<h3 class="j-name">Windows Phone 7 带来了什么?</h3>
										<span class="j-count">469在学</span>
										<p class="j-provider">发布者：极客公园</p>
										<p class="j-category">分类：</p>
										<p class="j-description">本期极客活动将邀请国内在 Windows Phone 7 平台有重要表现的嘉宾们，他们将于我们共同探讨 WP 7 手机的到来带来了什么样的革新和体验，并一起来看看他们又做了哪些创新。</p>
									</a>
								</div> -->
							</div>
							<div class="course language" style="display:none;"></div>
						</div>
						<!-- 翻页器 -->
						<ul class="page">
							<li class="prev"></li>
							<!-- <li>1</li>
							<li>2</li>
							<li>3</li>
							<li>4</li>
							<li>5</li>
							<li>6</li>
							<li>7</li>
							<li>8</li> -->
							<li class="next"></li>
						</ul>
					</div>

					<!-- 右侧 -->
					<div class="g-side">
						<!-- 视频 -->
						<div class="m-video" id="j-video">
							<h3>机构介绍</h3>
							<p>观看下面的视频来了解吧：</p>
							<div class="video">
								<img src="img/video.jpg"/>
								<i class="play-icon"></i>
							</div>
							<!-- 视频弹窗 -->
							<div class="popup-video" style="display:none">
								<div class="popup">
									<div class="colse"></div>
									<video controls width="890px" height="550px" src="http://mov.bn.netease.com/open-movie/nos/mp4/2014/12/30/SADQ86F5S_shd.mp4"></video>
								</div>
							</div>
						</div>
						<!-- 最热排行 -->
						<div class="m-list" id="j-list">
							<h3>最热排行</h3>
							<div class="warp-3">
								<div class="list">
									<!-- <a href="#">
										<div><img src="http://img1.ph.126.net/H-HpOv2NSYy4AL1wCg_MOw==/6631657103932142554.png" alt=""></div>
										<p>数字IC与FPGA面试笔试题讲解</p>
										<span>6546</span>
									</a> -->
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="g-ft">
			<div class="m-info">
				<div class="copyright">
					<div><i></i>网易教育产品部</div>
					<p>©2014 icourse163.org 浙ICP备08114786号-1<br/>
					icourses.cn 京ICP备12020869号-2 京公网安备110102000459-2</p>
				</div>
				<div class="link">
					<div>
						<p>友情链接：</p>
						<a href="#">网易公开课</a>
						<a href="#">网易云课堂</a>
						<a href="#">中国大学MOOC</a>
					</div>
					<div>
						<p>我们：</p>
						<a href="#">关于</a>
						<a href="#">联系</a>
						<a class="weibo" href="#">关注</a>
					</div>
					<div>
						<p>更多：</p>
						<a href="#">常见问题</a>
						<a href="#">意见反馈</a>
					</div>
				</div>
			</div>
		</div>

	</div>
	<script type="text/javascript" src="js/main.js"></script>
	<script type="text/javascript" src="js/md5.js"></script>
</body>
</html>